google.load("visualization", "1", {
	packages : [ "corechart" ]
});

function selectGraph(dataset) {	
	var option1 = document.getElementById("chart_option").innerText.trim();
	var option2 = document.getElementById("chart2_option").innerText.trim();
	var seq="";
	
	if(document.getElementById("att_option").title!=""){
		if(seq.length!=0)	seq=seq+",";
		seq=seq+document.getElementById("att_option").title.charAt(9);
	}
	if(document.getElementById("att2_option").title!=""){
		if(seq.length!=0)	seq=seq+",";
		seq=seq+document.getElementById("att2_option").title.charAt(9);
	}
	if(document.getElementById("att3_option").title!=""){
		if(seq.length!=0)	seq=seq+",";
		seq=seq+document.getElementById("att3_option").title.charAt(9);
	}
		
	
	$("#table").hide();
	$("#chart_div_1").css('height','500px');
	$("#chart_div_2").css('height','500px');
	$("#chart_div_1").css('margin-left','0');
	$("#chart_div_2").css('margin-left','0');
	$("#chart_div_1").css('height', '527px');
	$("#chart_div_2").css('height', '527px');

	document.getElementById("chart_div_1").innerHTML="";
	document.getElementById("chart_div_2").innerHTML="";
	
	drawTable(option1,option2, seq);
}


function drawTable(option1, option2, seq) {
	var divId ="";
	var option ="";	
	if(!containsChar(option1, "1") && containsChar(option2, "2")){
		$("#chart_div_2").css('width', '0%');
		$("#chart_div_1").css('width', '90%');	
		
		if (containsChar(option1,'Line Chart')) {
			drawChart("chart_div_1",seq);
		} else if (containsChar(option1,'Graph Chart')) {
			drawGraph2("chart_div_1",seq);
		} else if (containsChar(option1,'Grid Chart')) {
			drawMatrix2("chart_div_1",seq);
		} else if(containsChar(option1,'Word Cloud')){
			drawWordCloud("chart_div_1",seq);
			//$("#word_cloud_chart").show(1000);
		}
	}
	else if(containsChar(option1, "1") && !containsChar(option2, "2")){
		$("#chart_div_1").css('width', '0%');
		$("#chart_div_2").css('width', '90%');

		if (containsChar(option2,'Line Chart')) {
			drawChart("chart_div_2",seq);
		} else if (containsChar(option2,'Graph Chart')) {
			drawGraph2("chart_div_2",seq);
		} else if (containsChar(option2,'Grid Chart')) {
			drawMatrix2("chart_div_2",seq);
		} else if(containsChar(option2,'Word Cloud')){
			drawWordCloud("chart_div_2",seq);
			//$("#word_cloud_chart").show(1000);
		}		
	}
	else if(!containsChar(option1, "1") && !containsChar(option2, "2")){
		$("#chart_div_1").css('width', '45%');
		$("#chart_div_2").css('width', '45%');


		if (containsChar(option1,'Line Chart')) {
			drawChart("chart_div_1",seq);
		} else if (containsChar(option1,'Graph Chart')) {
			drawGraph2("chart_div_1",seq);
		} else if (containsChar(option1,'Grid Chart')) {
			drawMatrix2("chart_div_1",seq);
		} else if(containsChar(option1,'Word Cloud')){
			drawWordCloud("chart_div_1",seq);
			//$("#word_cloud_chart").show(1000);
		}

		if (containsChar(option2,'Line Chart')) {
			drawChart("chart_div_2",seq);
		} else if (containsChar(option2,'Graph Chart')) {
			drawGraph2("chart_div_2",seq);
		} else if (containsChar(option2,'Grid Chart')) {
			drawMatrix2("chart_div_2",seq);
		} else if(containsChar(option2,'Word Cloud')){
			drawWordCloud("chart_div_2",seq);
			//$("#word_cloud_chart").show(1000);
		}		
	}
	else{
		
	}
}

// mark selected list
function markList(section_name, flag) {
	var node = document.getElementById('selectable_' + section_name).childNodes;
	var j = 1;
	for ( var i = 0; i <= node.length; i++) {
		if (node[i].nodeType == 1) {
			var msg = (flag == j++) ? "button color-" + section_name
					: "button color-default";
			node[i].className = msg;
		}
	}
}

function tab1() {
	$("#PoliticsNews999").show();
	$("#ClueWeb09Korean").hide();
}

function tab2() {
	$("#ClueWeb09Korean").show();
	$("#PoliticsNews999").hide();
}

function toggleShowMenu() {
	if(containsChar(event.target.id, "att") 
			|| containsChar(event.target.id, "anal") 
			|| containsChar(event.target.id, "chart") )
	{		
		return true;
	};
	if (!($('#options').hasClass('click'))) {
		// Add 'clicked' class to the button that was clicked
		$('#options').addClass('click');
		$("#visualMenu").hide(500);
		return false;
	} else {
		// Remove any 'clicked' classes if there are any
		$('.click').removeClass('click');
		$("#visualMenu").show(500);
	}
}

// DRAG
function drag(target, e) {
	e.dataTransfer.setData('Text', target.id);
}

// DROP
function drop(target, e) {
	var id = e.dataTransfer.getData('Text');

	if (containsChar(target.id, "att")) {
		if (containsChar(id, "Attribute")) {
			target.innerHTML = document.getElementById(id).innerText + " &#215; <br />";
			target.title=id;
		}else
		{
			alert("Only Attribute");
			return false;
		}
		selectGraph('2013 IT Trend');
	}
	
	if (containsChar(target.id, "anal")) {
		if (containsChar(id, "Analysis")) {
			target.innerHTML = document.getElementById(id).innerText + " &#215;";
			target.title=id;
			//selectAnalysis(document.getElementById(id).innerText);
			
			if(containsChar(id, "Analysis1")){
				onChart("Chart1"); offChart("Chart2"); offChart("Chart3"); offChart("Chart4");
				offChart("Chart5"); offChart("Chart6"); offChart("Chart7"); offChart("Chart8");								
			}
			if(containsChar(id, "Analysis2")){
				offChart("Chart1"); onChart("Chart2"); onChart("Chart3"); offChart("Chart4");
				onChart("Chart5"); offChart("Chart6"); offChart("Chart7"); offChart("Chart8");				
			}
			if(containsChar(id, "Analysis3")){
				onChart("Chart1"); offChart("Chart2"); offChart("Chart3"); offChart("Chart4");
				offChart("Chart5"); offChart("Chart6"); offChart("Chart7"); offChart("Chart8");
			}
		}else{
			alert("Only Analysis");
			return false;
		}
		selectGraph('2013 IT Trend');
	}
	
	if (containsChar(target.id, "chart")) {
		if (containsChar(id, "Chart")) {
			target.innerHTML = document.getElementById(id).innerText + " &#215;";
			target.title=id;

			selectGraph('2013 IT Trend');
			//toggleShowMenu();
		}else{
			alert("Only Chart");
			return false;
		}
	}
	e.preventDefault();
}

function onChart(id){
	document.getElementById(id).style.color = "BLACK";
	document.getElementById(id).draggable =true;	
}

function offChart(id){
	var selectedChart = document.getElementById(id).innerText.trim();
	var option1 = document.getElementById("chart_option").innerText.trim();
	var option2 = document.getElementById("chart2_option").innerText.trim();
	
	if(containsChar(option1,selectedChart)){
		document.getElementById("chart_option").innerText="Chart1";		
	}
	if(containsChar(option2,selectedChart)){
		document.getElementById("chart2_option").innerText="Chart2";		
	}	
	
	document.getElementById(id).style.color = "SILVER";
	document.getElementById(id).draggable =false;		
}
function containsChar(input, chars) {
	if (input.indexOf(chars) != -1)
		return true;
	else
		return false;
}

function deleteOption(optionNm, chart){
	document.getElementById(optionNm).innerText = chart;	
	document.getElementById(optionNm).title = "";	
	if(containsChar(optionNm, "anal_option")){
		onChart("Chart1"); onChart("Chart2"); onChart("Chart3"); onChart("Chart4");
		onChart("Chart5"); onChart("Chart6"); onChart("Chart7"); onChart("Chart8");		
	}

	selectGraph('2013 IT Trend');
}
var tempText = '';
var touchYn = 0;
window.onload = function()
{
	var val= 0;
	if(('' + $('#myQuery').text()).length > 0)
	{
		$('#myModal').modal('show');
	}
	document.addEventListener('touchstart',function(event){		
		if(containsChar(event.target.id, 'Attribute') 
				|| containsChar(event.target.id, 'Chart')  
				|| containsChar(event.target.id, 'Analysis'))
		{
			touchYn = 1;
//			$('#ididid').val('start');
			tempText = event.target.id;			
			event.preventDefault();
		}		
	},false);
	document.addEventListener('touchmove',function(event){	
		
		if(containsChar(event.target.id, 'Attr'))
		{
//			$('#ididid').val('move');
			event.preventDefault();
		}
		
	},false);
	document.addEventListener('touchend',function(event){
		if(touchYn == 1)
		{
			if(containsChar(event.target.id,"att"))
			{
				if (containsChar(tempText, "Attribute")) {
					document.getElementById(event.target.id).innerHTML = $('#' + tempText).text() + " &#215; <br />";
					document.getElementById(event.target.id).title=tempText;					
					selectGraph('2013 IT Trend');
					touchYn = 0;
					event.preventDefault();
				}else
				{
					alert("Only Attribute");
					return false;
				}
		
				
			}
			if(containsChar(event.target.id,"anal_option"))
			{
				if (containsChar(tempText, "Analysis")) {
					document.getElementById(event.target.id).innerHTML = $('#' + tempText).text() + " &#215; <br />";
					document.getElementById(event.target.id).title=tempText;										
					touchYn = 0;
					event.preventDefault();
				}else
				{
					alert("Only Analysis");
					return false;
				}
		
				
			}
			if(containsChar(event.target.id,"chart"))
			{
				if (containsChar(tempText, "Chart")) {
					document.getElementById(event.target.id).innerHTML = $('#' + tempText).text() + " &#215; <br />";
					document.getElementById(event.target.id).title=tempText;
					selectGraph('2013 IT Trend');
					touchYn = 0;
					event.preventDefault();
				}else
				{
					alert("Only Chart");
					return false;
				}	
			}
		}	
	},false);
}

